import React from 'react'
import { Container,Header,NoticeWrap,WorkWrap } from './StyleHomePage'
import { useHistory } from 'react-router-dom'
import Swiper from '../ui/Swiper'
import Search from '@c/search/Search'
import Nav from './Nav'
import Recommend from './Recommend'

import Notice from '@a/images/home/notice.png'
import Msg from '@a/images/home/message.png'
import Pen from '@a/images/home/pen.png'
import Glass from '@a/images/home/glass.png'

const HomePageUi = (props) => {
    let history = useHistory()
    return (
        <Container>
            <Header>
                <span>北京市</span>
                <Search></Search>
                <img src={`${Msg}`} alt="" onClick={ ()=>history.push('/window')} />
            </Header>
            <Swiper></Swiper>
            <NoticeWrap>
                <img src={`${Notice}`} alt=""/>
                <span>这是一个公告这是一个公告这是一个公告</span>
            </NoticeWrap>
            <WorkWrap>
                <ul>
                    <li
                        onClick={ ()=>history.push('/assionwork')}
                    >
                        <div 
                            className="work"
                            style={{background:'#2384ff'}}
                        ><img src={`${Pen}`}  alt=""/></div>
                        <span>布置作业</span>
                    </li>
                    <li
                            onClick={ ()=>history.push('/check')}
                    >
                        <div 
                            className="work"
                            style={{background:'#f5c143'}}
                        ><img src={`${Glass}`} alt=""/></div>
                        <span>发布作业</span>
                    </li>
                </ul>
            </WorkWrap>
            <Nav></Nav>
            <Recommend></Recommend>
        </Container>
    )
}

export default HomePageUi